<!DOCTYPE html>
<html>
	<head>
		<title>Elliptical Shapes</title>
		<style type="text/css">
			p {
				border: 5px solid #ee3e80;
				padding: 10px;
				width: 100px;
				height: 100px;
				display: inline-block;
				margin: 20px;}
			p.one {
				border-top-left-radius: 80px 50px;
				-moz-border-radius-top-left: 80px 50px;
				-webkit-border-radius-top-left: 80px 50px;}
			p.two {
				border-radius: 1em 4em 1em 4em / 2em 1em 2em 1em;
				-moz-border-radius: 1em 4em 1em 4em / 2em 1em 2em 1em;
				-webkit-border-radius:  1em 4em 1em 4em / 2em 1em 2em 1em;}
			p.three {
				padding: 0px;
				border-radius: 100px;
				-moz-border-radius: 100px;
				-webkit-border-radius: 100px;}
		</style>
	</head>
	<body>
		<p class="one"></p>
		<p class="two"></p>
		<p class="three"></p>
	</body>
</html>